<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="iconfont/iconfont.css">
    <script src="js/flexible.js"></script>
    
</head>
<body> 
    <!-- head   ---- s -->
    <div class="banner">
        <div class="pic">
        <img src="./images/banner.png" alt="">
        </div>

        <div class="search">
          <span> <i class="iconfont icon-search"></i><input type="text " placeholder="搜索商店或店铺"></span>
            </div>       
    </div>
 <!-- head   ---- E -->


 <!-- nav    ----s -->
    <div class="nav">
        <div>
       <img src="./images/icon1.png" alt="">
       <p>购物车</p>
        </div>
        <div>
            <img src="./images/icon1.png" alt="">
            <p>购物车</p>
             </div>
             <div>
                <img src="./images/icon1.png" alt="">
                <p>购物车</p>
                 </div>
                 <div>
                    <img src="./images/icon1.png" alt="">
                    <p>购物车</p>
               </div>
    </div>
      </div>
       <!-- nav    ----E -->

       <!-- list     --S-->
      <div class="list">
        <div>
            <h3>书籍</h3>
            <span>全场低至5折”</span>
             <img src="./images/pic1.png" alt="">
        </div>
        <div>
            <h3>书籍</h3>
            <span>全场低至5折”</span>
             <img src="./images/pic2.png" alt="">
        </div><div>
            <h3>书籍</h3>
            <span>全场低至5折”</span>
             <img src="./images/pic3.png" alt="">
        </div><div>
            <h3>书籍</h3>
            <span>全场低至5折”</span>
             <img src="./images/pic4.png" alt="">
        </div>
    </div>
    <div class="ad">
        <h3>超值热卖</h3>
        <span class="iconfont icon-roundright"></span>
        <div class="btn">
            <span>1/2</span>
        </div>
    </div>
      <!-- list     --E-->
    


        <!-- goods   --S-->
  <div class="goods">
    <div class="item">
        <div class="pic">
            <img src="./images/pic5.png" alt="">
        </div>
        <p>女士白色长颈鹿T恤</p>
        <span> <i>¥</i> 999</span>
    </div>

    <div class="item2">
        <div class="pic">
            <img src="./images/pic5.png" alt="">
        </div>
        <p>女士白色长颈鹿T恤</p>
        <span> <i>¥</i> 999</span>
    </div>
    </div>         
  </div>

        <!-- goods   --E-->

  <!-- footer   --- E --> 
  <footer>
    <div>
    <span class="iconfont icon-home
    ">
        <p>首页</p>
    </span>
    </div>
    <div>
        <span class="iconfont icon-home
        ">
            <p>分类</p>
        </span>
        </div> <div>
            <span class="iconfont icon-gouwu
            ">
                <p>购物车</p>
            </span>
            </div> <div>
                <span class="iconfont icon-wode
                ">
                    <p>我的</p>
                </span>
                </div>
   
  </footer>

  <!-- footer   --- E --> 



    
</body>

</html>